import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
//import Qt5Compat.GraphicalEffects
//import QtGraphicalEffects 1.12
import "./uicontrol" as MyControls

ApplicationWindow {
    id: rootWindow
    width: 730
    height: 510
    visible: true
    title: qsTr("ToxDesk")
    modality: Qt.WindowModal
    flags: Qt.Dialog | Qt.FramelessWindowHint | Qt.WindowSystemMenuHint|Qt.WindowMinimizeButtonHint //去标题栏
    color: "#00000000"
    property bool isMoveWindow: false
    property point rootWindowTitleMousePos: Qt.point(x, y)
    onTitleChanged: rootWindow.text = title

    Rectangle {
        id: mainRec
        radius: 12
        opacity: 1
        anchors.fill: parent
        //width: parent.width-20
        //height: parent.height-20
        //anchors.centerIn: parent

        //layer.enabled: true
        ColumnLayout {
            width: parent.width
            height: parent.height
            Layout.alignment: Qt.AlignTop
            Layout.margins: 5

            RowLayout {
                id: titlebar
                height: 29

                Control {
                    leftInset: 5
                    rightInset: 5

                    background: Image {
                        source: "qrc:/images/ToxDesk.png"
                        sourceSize: Qt.size(25, 25)
                    }
                }
                Label {
                    text: "ToxDesk"
                    rightPadding: 10
                    color: "#FF696969"
                }

                Rectangle {
                    Layout.fillWidth: true
                    //Layout.fillHeight:true
                }

                MyControls.Button {
                    id: minbtn
                    width: 22
                    height: 22
                    normalimage: "qrc:/images/title_min_normal.png"
                    hotimage: "qrc:/images/title_min_hover.png"
                    pushedimage: "qrc:/images/title_min_down.png"
                    onClicked: {
                        rootWindow.showMinimized()
                    }
                }
                MyControls.Button {
                    id: closebtn
                    width: 22
                    height: 22
                    normalimage: "qrc:/images/title_close_normal.png"
                    hotimage: "qrc:/images/title_close_hover.png"
                    pushedimage: "qrc:/images/title_close_down.png"
                    onClicked: {
                        rootWindow.close()
                    }
                }

                // 为窗口标题栏添加鼠标事件
                MouseArea {
                    height: titlebar.height
                    anchors.left: titlebar.left
                    anchors.right: minbtn.left
                    // 只处理鼠标左键
                    acceptedButtons: Qt.LeftButton

                    // 接收鼠标按下事件
                    onPressed: {

                        rootWindow.rootWindowTitleMousePos = Qt.point(mouseX,
                                                                      mouseY)
                        rootWindow.isMoveWindow = true
                    }

                    // 鼠标释放，关闭窗口移动flag
                    onReleased: {
                        if (mouse.button === Qt.LeftButton) {

                            rootWindow.isMoveWindow = false
                        }
                    }
                    onMouseXChanged: {

                        if (rootWindow.isMoveWindow) {

                            rootWindow.x += mouseX - rootWindow.rootWindowTitleMousePos.x
                        }
                    }
                    onMouseYChanged: {

                        rootWindow.y += mouseY - rootWindow.rootWindowTitleMousePos.y
                    }
                }
            }
            RowLayout {
                id: downLayout
                Layout.fillWidth: true
                Layout.fillHeight: true
                Layout.alignment: Qt.AlignTop
                spacing: 0

                ColumnLayout {
                    id: downleftLayout
                    width: 160
                    Layout.maximumWidth: 160
                    Layout.alignment: Qt.AlignTop
                    Layout.fillHeight: true
                    Layout.preferredHeight: 600

                    Rectangle {
                        id: roundRect
                        radius: 12
                        anchors.fill: parent
                        color: "#F0F3F8"
                    }

                    Rectangle {
                        id: squareRect
                        color: "#F0F3F8"
                        width: roundRect.radius
                        height: roundRect.radius
                        anchors.top: roundRect.top
                        anchors.left: roundRect.left
                    }
                    Rectangle {
                        color: "#F0F3F8"
                        width: roundRect.radius
                        height: roundRect.radius
                        anchors.top: roundRect.top
                        anchors.right: roundRect.right
                    }

                    Rectangle {
                        color: "#F0F3F8"
                        width: roundRect.radius
                        height: roundRect.radius
                        anchors.bottom: roundRect.bottom
                        anchors.right: roundRect.right
                    }

                    Image {
                        id: logo
                        anchors.top: parent.top
                        anchors.horizontalCenter: parent.horizontalCenter
                        source: "qrc:/images/remote-desktop.png"
                        sourceSize: Qt.size(120, 120)
                    }

                    ButtonGroup {
                        buttons: column.children
                    }
                    Column {
                        id: column
                        spacing: 20
                        topPadding: 30
                        anchors.top: logo.bottom
                        anchors.horizontalCenter: parent.horizontalCenter
                        width: parent.width - 30
                        MyControls.RadioBtnColor {
                            id: remotectl
                            text: qsTr("remoteCtrl")
                            font.pointSize: 12
                            //font.bold: true
                            height: 38
                            width: parent.width
                            checked: true
                            textcolor: "#696969"
                            selectedtextcolor: "#FFFFFFFF"
                            hotcolor: "#E0E6EE"
                            selectedcolor: "#8EABDD"
                            foreimage: "qrc:/images/icon_downloading_normal.png"
                            hotforeimage: "qrc:/images/icon_downloading_hover.png"
                            selectedforeimage: "qrc:/images/icon_downloading_pushed.png"

                            onToggled: {
                                console.info("cleck")
                                stackView.pop()
                                stackView.push("qrc:/remote.qml")
                            }
                        }

                        MyControls.RadioBtnColor {

                            id: syssetting
                            text: qsTr("sysSetting")
                            font.pointSize: 12
                            height: 38
                            checked: false
                            width: parent.width
                            textcolor: "#696969"
                            selectedtextcolor: "#FFFFFFFF"
                            hotcolor: "#E0E6EE"
                            selectedcolor: "#8EABDD"
                            foreimage: "qrc:/images/catalog_normal.png"
                            hotforeimage: "qrc:/images/catalog_hover.png"
                            selectedforeimage: "qrc:/images/catalog_pushed.png"

                            onToggled: {
                                console.info("cleck")
                                stackView.pop()
                                stackView.push("qrc:/setting.qml")
                            }
                        }
                    }
                }

                StackView {
                    id: stackView

                    //                    background: Rectangle {
                    //                        color: "#ffffff"
                    //                        //border.color : "#ff0000"
                    //                    }
                    pushEnter: Transition {
                        PropertyAnimation {
                            property: "opacity"
                            from: 0
                            to: 1
                            duration: 200
                        }
                    }
                    pushExit: Transition {
                        PropertyAnimation {
                            property: "opacity"
                            from: 1
                            to: 0
                            duration: 200
                        }
                    }
                    popEnter: Transition {
                        PropertyAnimation {
                            property: "opacity"
                            from: 0
                            to: 1
                            duration: 200
                        }
                    }
                    popExit: Transition {
                        PropertyAnimation {
                            property: "opacity"
                            from: 1
                            to: 0
                            duration: 200
                        }
                    }
                    Layout.fillWidth: true
                    Layout.fillHeight: true
                    initialItem: "qrc:/remote.qml"
                }
            }
        }
    }

    // 左边缘及上边缘阴影
    //    DropShadow {
    //           anchors.fill: mainRec
    //           horizontalOffset: -5
    //           verticalOffset: -5
    //           radius: 12.0
    //           samples: 25
    //           color: "#20000000"
    //           spread: 0.0
    //           source: mainRec
    //    }

    //    // 右边缘及下边缘阴影
    //    DropShadow {
    //            anchors.fill: mainRec
    //            horizontalOffset: 5
    //            verticalOffset: 5
    //            radius: 12.0
    //            samples: 25
    //            color: "#20000000"
    //            spread: 0.0
    //            source: mainRec
    //}
    Component.onCompleted: {
        console.log("downLayout height:" + downLayout.height)
        console.log("downleftLayout:" + downleftLayout.height)
    }
}
